<template>
    <div class="home">
        <video class="video" height="556" width="1920" autoplay muted loop poster="//tianqi-stream.2345cdn.net/tqpcimg/tianqiimg/theme4/V2Images/bg_duoyun.png?x-oss-process=image/format,jpg/quality,Q_30">
            <source src="//tianqi-stream.2345cdn.net/tqpcimg/tianqiimg/theme4/V2Images/MP4/duoyun.mp4" type="video/mp4">
        </video>
        <div class="box"></div>
        <banner></banner>
        <tianqi></tianqi>
    </div>
</template>

<script>
import banner from '@/components/banner.vue';
import tianqi from '@/components/tianqi.vue';
    export default {
        data(){
            return {

            }
        },
        components:{
            banner,
            tianqi
        }
    }
</script>

<style lang="scss" scoped>
.home{
    width:100%;
    .video{
        position:absolute;
        top:0;
        left:50%;
        margin-left:-960px;
    }
    .box{
        position:absolute;
        top:0;
        left:50%;
        margin-left:-960px;
        width:1920px;
        height:556px;
        background:url('//tianqi-stream.2345cdn.net/tqpcimg/tianqiimg/theme4/V2Images/bg/duoyun_fg.png?v=1.1') no-repeat 0 0;
    }
}
</style>